<template>
  <div>
    <p></p>

    <el-form
      :model="entity"
      :rules="rules"
      ref="form"
      label-width="100px"
      class="dialog-form"
    >
      <el-row :span="24">
        <!-- <el-col :span="12">
          <el-form-item style="width: 100%" label="部门" prop="departmentId">
            <el-input disabled placeholder="部门" v-model="entity.departmentId">
            </el-input>
          </el-form-item>
        </el-col> -->
        <el-col :span="12">
          <el-form-item style="width: 100%" label="员工" prop="employee">
            <el-input disabled placeholder="员工" v-model="entity.employee.name">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item style="width: 100%" label="周期" prop="periodYm">
            <el-input
              :disabled="disabled"
              placeholder="周期"
              v-model="entity.periodYm"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item style="width: 100%" label="出勤天数" prop="rWorkdays">
            <el-input
              :disabled="disabled"
              placeholder="出勤天数"
              v-model="entity.rWorkdays"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item style="width: 100%" label="缺勤天数" prop="absentDays">
            <el-input
              :disabled="disabled"
              placeholder="缺勤天数"
              v-model="entity.absentDays"
            >
            </el-input>
          </el-form-item>
        </el-col>
      <el-col :span="12">
          <el-form-item style="width: 100%" label="有薪假" prop="rHdaysPay">
            <el-input
              :disabled="disabled"
              placeholder="有薪假"
              v-model="entity.rHdaysPay"
            >
            </el-input>
          </el-form-item>
        </el-col>
          <el-col :span="12">
          <el-form-item style="width: 100%" label="无薪假" prop="rHdays">
            <el-input
              :disabled="disabled"
              placeholder="无薪假"
              v-model="entity.rHdays"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item style="width: 100%" label="缺卡次数" prop="noCardTimes">
            <el-input
              :disabled="disabled"
              placeholder="缺卡次数"
              v-model="entity.noCardTimes"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="12">
          <el-form-item style="width: 100%" label="加班工时" prop="rOvertime">
            <el-input
              :disabled="disabled"
              placeholder="加班工时"
              v-model="entity.rOvertime"
            >
            </el-input>
          </el-form-item>
        </el-col> -->
        <el-col :span="12">
          <el-form-item
            style="width: 100%"
            label="平时加班"
            prop="rOvertimeNormal"
          >
            <el-input
              :disabled="disabled"
              placeholder="平时加班"
              v-model="entity.rOvertimeNormal"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            style="width: 100%"
            label="周休日加班"
            prop="rOvertimeWeekday"
          >
            <el-input
              :disabled="disabled"
              placeholder="周休日加班"
              v-model="entity.rOvertimeWeekday"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            style="width: 100%"
            label="节假日加班"
            prop="rOvertimeHoliday"
          >
            <el-input
              :disabled="disabled"
              placeholder="节假日加班"
              v-model="entity.rOvertimeHoliday"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item style="width: 100%" label="迟到次数" prop="delayTimes">
            <el-input
              :disabled="disabled"
              placeholder="迟到次数"
              v-model="entity.delayTimes"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item style="width: 100%" label="迟到分钟" prop="delayN">
            <el-input
              :disabled="disabled"
              placeholder="迟到分钟"
              v-model="entity.delayN"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item style="width: 100%" label="早退次数" prop="eLeaveTimes">
            <el-input
              :disabled="disabled"
              placeholder="早退次数"
              v-model="entity.eLeaveTimes"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item style="width: 100%" label="早退分钟" prop="eLeaveN">
            <el-input
              :disabled="disabled"
              placeholder="早退分钟"
              v-model="entity.eLeaveN"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            style="width: 100%"
            label="异常标识"
            prop="abnormalFlag"
          >
            <el-select
              style="width: 100%"
              v-model="entity.abnormalFlag"
              :disabled="disabled"
            >
              <el-option :key="true" :value="true" :label="'是'"></el-option>
              <el-option :key="false" :value="false" :label="'否'"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item style="width: 100%" label="创建人" prop="createdBy">
            <el-input disabled placeholder="创建人" v-model="entity.username">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item v-if="entity.abnormalFlag" style="width: 100%" label="异常原因" prop="abnormal">
            <el-input
              type="textarea"
              :rows="2"
              :disabled="disabled"
              placeholder="异常原因"
              v-model="entity.abnormal"
            >
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="24">
          <el-form-item style="width: 100%" label="休班详情" prop="abnormal">
           <!--  <el-input
              type="textarea"
              :rows="2"
              :disabled="disabled"
              placeholder="休班详情"
              v-model="entity.holidayDefine"
            >
            </el-input> -->
            {{JSON.stringify(entity.holidayDefine)}}
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<style lang="less" scoped>
.merchantLogo .el-upload-dragger {
  img {
    height: 200px !important;
  }
}

.dialog-form {
  .el-radio-group {
    .el-radio {
      display: flex;
      align-items: center;
    }

    label {
      height: 40px;
    }
    .group-text {
      display: inline-block;
      width: 100px;
    }
    .title-text {
      display: inline-block;
      width: 120px;
    }
  }
}
</style>

<script>
const defaultEntity = {
  monthId: null, //  月度标识
  employeeId: 0, //  员工标识
  employee:{},
  periodYm: null, //  考勤周期
  rWorkdays: 0, //  出勤天数
  rHolidays: 0, //  请假天数
  absentDays: 0, //  缺勤天数
  rOvertime: 0, //  加班工时
  rOvertimeNormal: 0, //  平时加班
  rOvertimeWeekday: 0, //  周休日加班
  rOvertimeHoliday: 0, //  节假日加班
  noCardTimes: 0, //  缺卡次数
  delayTimes: 0, //  迟到次数
  delayN: 0, //  迟到(分钟)
  eLeaveTimes: 0, //  早退次数
  eLeaveN: 0, //  早退(分钟）
  abnormalFlag: false, //  异常标识
  createdBy: 0, //  创建人
  abnormal: null, //  异常
  createdAt: null, //  创建时间
};
export default {
  components: {},
  data() {
    return {
      disabled: true,
      parentId: 0,
      ruleTpl: { when: null, then: null },
      entity: _.cloneDeep(defaultEntity),
      dateRange: [],
      oldProps: [],
      ruleDefs: [],
      isDisabled: false,
      limitTotal: false,
      rules: {
        custNo: [
          { required: true, message: "编号不能为空", trigger: "blur" },
          {
            min: 1,
            max: 6,
            message: "长度在 1 到 6 个字符",
            trigger: "blur",
          },
        ],
        custName: [
          { required: true, message: "名称不能为空", trigger: "blur" },
          {
            min: 1,
            max: 64,
            message: "长度在 1 到 64 个字符",
            trigger: "blur",
          },
        ],
        startOn: [
          {
            required: true,
            message: "请选择开始时间",
            trigger: "blur",
          },
        ],
        merchantId: [
          {
            type: "number",
          },
        ],
        status: [
          {
            type: "number",
            required: true,
            message: "请选择状态",
            trigger: "change",
          },
        ],
        discountType: [
          {
            type: "number",
            required: true,
            message: "请选择优惠类型",
            trigger: "change",
          },
        ],
      },
    };
  },
  methods: {
    getProps(scope) {
      return this.entity.props.filter((p) => p.propScope == scope);
    },
    onRuleDefsLoaded(opts) {
      this.ruleDefs = opts || [];
      this.resetProps();
    },
    onDiscountTypeChange(val) {
      if (val == 3) {
        //次数只能一次
        this.entity.discountValue = 1;
      }
    },
    resetProps() {},
    setValues(vals) {
      this.resetEntity = _.cloneDeep(vals);
      this.entity = _.cloneDeep(this.resetEntity);
    },
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          let params = Object.assign({}, this.entity);

          this.$api.attend.attend.MonthService.save(params).then((rsp) => {
            this.$emit("saved", rsp);
          });
        }
      });
    },
    resetForm() {
      //this.$refs["form"].resetFields();
      this.entity = _.cloneDeep(defaultEntity);
      if (!this.entity.monthId) {
        this.entity.createDate = this.$dongxwDict.formatDateZero(new Date());
      }
    },
    init(options) {
      this.resetForm();
      if (options.monthId) {
        this.$api.attend.attend.MonthService.findById(
          options.monthId
        ).then((r) => {
          this.entity = r.data;
          if (!this.entity.employee) {
            this.entity.employee = { name: "-" };
          }
        });
      } else {
        this.isDisabled = false;
      }
    },
  },
  mounted() {
    this.$on("init", this.init);
    this.$on("submit", this.submitForm);
  },
};
</script>
